$(()=>{
    let $width=$('#width'),
      $height=$('#height'),
      $btnCal=$('#calc'),
      $preimeter=$('#preimeter'),
      $kuan=$('#kuan'),
      $gao=$('#gao'),
      $area=$('#area')
      $form=$('#main');
//字符级校验
  $forkMeGH.show("https://github.com/wangding/rectangle")
function isLegalKey(key, content, pos) {
  // 过滤非法字符
  if(/[abcdf-zABCDF-Z`~!@#$%^&*()=_+[\]{}|;:'",<>/?\\]/.test(key)) {
    return false;
  }

  // 合法字符：. 小数点
  if(key === '.') {
    // 规则：小数点不能出现在数字的首位
    if(pos === 0) return false;

    // 规则：小数点不能出现在小数中
    if(content.indexOf('.') !== -1) return false;

    // 规则：小数点不能出现在负号以及 e 或 E 后面
    if(pos > 0 && /[-eE]/.test(content.slice(0, pos))) return false;
  }

  // 合法字符：e 和 E 科学计数法指数符号
  if(key === 'e' || key === 'E') {
    // 规则：e 和 E 不能出现在数字的首位
    if(pos === 0) return false;

    // 规则：e 和 E 不能出现在科学计数法的数字中
    if(content.indexOf('e') !== -1 || content.indexOf('E') !== -1) return false;

    // 规则：e 和 E 不能出现在负号和小数点后面
    if(pos > 0 && /[-.]/.test(content.slice(pos - 1, pos))) return false;

    // 规则：e 和 E 不能出现在小数点前面
    if(content.slice(pos, content.length).indexOf('.') !== -1) return false;
  }

  // 合法字符：- 负号
  if(key === '-') {
    // 规则：负号不能出现在数字的首位
    if(pos === 0) return false;

    // 规则：负号不能出现在数字和小数点后面
    if(pos > 0 && /[0-9.]/.test(content.slice(pos -1, pos))) return false;

    // 规则：负号不能重复出现
    if(pos > 0 && content.indexOf('-') !== -1) return false;
  }

  return true;
}



//
$width.focusout(() => {
    let result = validate($width.val());
    isPassValidate = result.isOK;
    if(!result.isOK) {
      $widthValidate.html('宽度' + result.reason);
      $width.select();
    } else {
      $widthValidate.html('');
    }
  });

  $width.keypress((e) => {
    if(!isLegalKey(e.key, e.target.value, e.target.selectionStart)) {
      e.preventDefault();
    }
  });

  $height.focusout(() => {
    let result = validate($height.val());
    isPassValidate = result.isOK;
    if(!result.isOK) {
      $heightValidate.html('高度' + result.reason);
      $height.select();
    } else {
      $heightValidate.html('');
    }
  });

  $height.keypress(function(e) {
    if(!isLegalKey(e.key, e.target.value, e.target.selectionStart)) {
      e.preventDefault();
    }
  });

/*
 * 当字段比较少的时候
$width.focusout(()=>{
  if(validate($width,$kuan)){
    $width.select();
  }
});
$height.focusout(()=>{
  if(validate($height,$gao)){
    $height.select();
  }
});
*/
function roundFractional(x, n) {
    return Math.round(x * Math.pow(10, n)) / Math.pow(10, n);

}
function validate(input,output){
  //empty
  if(input.val()===''){
    output.html('该字段不能为空');
    return false;
  }else{
    output.html('');
  }
  //number
  let val=Number(input.val());
  if(isNaN(val)){
    output.html('这个字段应该是数值');
    return false;
  }else{
    output.html('');
  }
  //range(范围)
  if(Number(val)<0){
    output.html('该字段应该是正数');
    return false;
  }else{
    output.html('');
  }
  return true;
}
$btnCal.click(()=>{

    let w=Number($width.val()),
        h=Number($height.val());
  //validate
if(validate($width,$kuan) && validate($height,$gao)){



  let p=roundFractional((w+h)*2,3),
        a=roundFractional(w*h,3);
  $preimeter.val(p);
    $area.val(a);
}
})

})

